<div
  class="col-sm-12 col-md-6 col-lg-4 p-2 filtr-item"
  data-category='all, {{ delimit  .tags ","}}'
>
  <div class="card mt-1">
    <div class="card">
      <a class="card-header" href="{{ if .repo }}{{ .repo }}{{ else if .url }}{{ .url }}{{ else }}javascript:void(0){{ end }}">
        <div>
          <div class="d-flex">
            {{ if .logo }}

            {{ $logoImage:= resources.Get .logo}}
            {{ if $logoImage }}
            {{ $logoImage := $logoImage.Fit "24x24" }}

            <img class="card-img-xs" src="{{ $logoImage.RelPermalink }}" alt="{{ .name }}" />
            {{ end }}
            {{ end }}
            <h5 class="card-title mb-0">{{ .name }}</h5>
          </div>
          <div class="sub-title">
            <span>{{ .role }}</span>
            <span>{{ .timeline }}</span>
          </div>
        </div>
      </a>
      <div class="card-body text-justify pt-1 pb-1">
        <p>{{ .summary | markdownify }}</p>
        <span class="float-right">
          {{ if .repo }}
          <a
            class="github-button-inactive"
            href="{{ .repo }}"
            data-icon="octicon-standard"
            data-show-count="true"
            aria-label="Star {{ .name }}"
            >Star</a
          >
          {{ else if .url }}
          <a
            class="btn btn-outline-info btn-sm mb-2"
            href="{{ .url }}"
            target="#"
            >Details</a
          >
          {{ end }}
        </span>
      </div>
    </div>
  </div>
</div>
